<template>
	<div class="renzheng">
		<!-- 认证成功弹出框 -->
		<div class="renzhengSuc" v-show="isShow1"><div class="suc2">
			<div class="mes1">
				<div class="pic1"></div>
				<div class="closeBtn" v-on:click="goYanzheng"><span class="close"></span></div>
				<p style="padding-top: 2.6rem;font-size: 0.36rem">认证成功</p>
				<p style="font-size: 0.24rem;margin-top: 0.4rem">您可以查看您的工资信息了呦</p>
				<button v-on:click="goInfo">确&nbsp&nbsp认</button>
			</div>
		</div>
		<div class="suc1"></div>
	</div>
	<!-- 认证失败弹出框 -->
	<div class="renzhengFal" v-show="isShow2"><div class="suc2">
		<div class="mes1">
			<div class="pic2"></div>
			<div class="closeBtn" v-on:click="goYanzheng"><span class="close"></span></div>
			<p style="padding-top: 2.6rem;font-size: 0.36rem">认证失败！</p>
			<p style="font-size: 0.24rem;margin-top: 0.4rem">请您再次确认您的信息后填写</p>
			<button v-on:click="goYanzheng">确&nbsp&nbsp认</button>
		</div>
	</div>
	<div class="suc1"></div>
</div>
<!-- 原内容 -->
<div class="bac"></div>
<div class="header">信息认证</div>
<div class="bacbox">	
</div>
<div class="containbox">
	<div class="logo">

	</div>
	<p class="comname">希古尚博</p>
	<form action="http://api.kx910.com/api/wechat/auth" method="get">
	<div style="position: relative;height: 0.8rem"><i class="user"></i><input type="text" name="name" class="forminput" placeholder="姓名" v-model="name"></div>
	<div style="position: relative;height: 0.8rem;margin-top: 0.33rem"><i class="id"></i><input type="text" name="idcard" class="forminput" placeholder="身份证号" v-model="idcard">
	</div>
	<div><button class="confirm" type="submit">确&nbsp&nbsp认</button></div></form>
</div>
<div class="footer"></div>
</div>
</template>
<script>
	
	export default {
		created(){
			console.log("localStorage",localStorage.userinfo)
			console.log("token",this.$route.query.token)
			if (this.$route.query.token!==undefined && this.$route.query.token!==null) {
					var _this = this
			this.$http.post("http://api.kx910.com/api/wechat/getUserinfo",{
				token:this.$route.query.token
				
			})

			.then(function(res){

				console.log("1",_this.isShow1)
				console.log(res)
				
				if (res.data.code>0) {
					localStorage.wxToken = _this.$route.query.token
					localStorage.userinfo=JSON.stringify(res.data.data)
					_this.isShow1="true"
				}else{

					_this.isShow2="true"	
				}		
				
			})
			}
			

		},
		
		data(){
			return{
				name:"",
				idcard:"",
				isShow1:false,
				isShow2:false
			}
		},
		methods:{
			// submit:function (argument) {
			// 	// body... 
			// 	console.log(this.idcard);
			// 	var _this = this
			// 	console.log(this.name)			
			// 	this.$http.get('http://api.kx910.com/api/wechat/auth',{
			// 	idcard:this.idcard,
			// 	name:this.name
				
   //  		})
   //  		.then(function(res){
   //  			console.log('suc')
   //  			console.log(0,res)
   //  			_this.$http.get(res.data,{})
   //  			.then(function(data){
   //  				console.log("1",data)
   //  			})
   //  		})
			// }
			goInfo:function(){
				this.$router.push('/userinfo')
			},
			goYanzheng:function(){
				this.isShow2=false
			}
		}
	}
</script>
<style scoped>
input{
	outline: none
}
	.renzheng{
		font-family: "微软雅黑";
	}
	.bac{
		width: 100%;height: 100%;position: absolute;z-index: -999;background: linear-gradient(135deg, #4facfe, #00f2fe);
	}
	.header{
		width: 100%;
		text-align: center;
		font-size: 0.36rem;
		padding-top: 0.35rem;
		color: white
		
	}
	.bacbox{
		width: 74%;
		height: 50px;
		background-color: #94dcfc;margin: 0 auto;
		margin-top: 1.15rem;
		z-index: 1;
		border-radius: 10px
	}
	.containbox{
		width: 80%;
		height: 7.2rem;
		background-color: white;
		margin: 0 auto;
		z-index:10;
		position: absolute;
		left:10% ;top: 2.3rem;
		border-radius: 10px;
		text-align: center;
	}
	.logo{
		width: 1.44rem;
		height: 1.44rem;
		background: url(../../assets/img/logo-bg.png) no-repeat ;
		background-size: contain;
		margin: 0 auto;
		margin-top: 0.44rem;
		margin-bottom: 0.3rem

	}
	.comname{
		font-size: 0.24rem;
		text-align: center;
		color: #00a0e9;
		margin-bottom: 0.4rem;
	}
	.forminput{
		width: 3.85rem;
		height: 0.8rem;
		border-radius: 0.4rem;
		border: 1px solid #e1e1e1;
		padding-left: 1.15rem;
		position: relative;
	}
	.user{
		width: 0.27rem;
		height: 0.29rem;
		background: url(../../assets/img/user.png);
		display: block;
		background-size: contain;
		position: absolute;
		z-index: 10;
		left: 1.55rem;top: 0.28rem
	}
	.id{
		width: 0.37rem;height: 0.29rem;
		background: url(../../assets/img/身份证.png);
		background-size: contain;
		display: block;
		position: absolute;
		z-index: 10;
		left: 1.55rem;top: 0.28rem
	}
	.confirm{
		width: 5.0rem;
		height: 0.8rem;
		border-radius: 0.4rem;
		border: 1px solid #e1e1e1;
		background-color: #43c3ff;
		margin-top: 1rem;
		outline: none;
		color: white

	}
	.footer{
		bottom:0.6rem;
		position: absolute;
		background: url(../../assets/img/认证-实名认证2_66.png);
		background-size: contain;
		width: 4.93rem;height: 0.2rem;
		left: 18%
	}
	.suc1{
		width: 100%;height: 100%;position: absolute;z-index: 900;background: rgba(170,170,170,0.5);
	}
	.mes1{
		width: 6.33rem;
		height: 5.8rem;
		background-color: white;
		z-index: 999;
		margin:0 auto;
		margin-top: 4.2rem;
		color: #00a0e9;
		text-align: center;
	}
	.suc2{
		width: 100%;height: 100%;position: absolute;z-index: 920;
	}
	.mes1 button{
		width: 2.5rem;
		height: 0.6rem;
		background-color: rgb(0,129,224);
		margin-top: 1.12rem;
		border-radius: 5px;
		border: none;
		color: white
	}
	.pic1{
		background: url(../../assets/img/组3.png);
		width: 2.85rem;
		height: 3.13rem;
		z-index: 930;
		background-size: contain;
		position: absolute;
		top: 3.3rem;left: 2.3rem;
	}
	.pic2{
		background: url(../../assets/img/组3false.png);
		width: 2.85rem;
		height: 3.13rem;
		z-index: 930;
		background-size: contain;
		position: absolute;
		top: 3.3rem;left: 2.3rem;
	}
	.close::before{
		content: "\2716"
	}
	.closeBtn{
		position: absolute;
		right: 0.8rem;
		font-size: 0.3rem;
		cursor: pointer;
	}
	
</style>